import React, { useState } from 'react'

// useState  用来定义函数式组件中的内部状态
// 不推荐通过useState来定义对象类型的数据
function Home() {
    const [count, setCount] = useState(100)
    const [user, setUser] = useState({ name: "张三", age: 18 })
    // setCount  修改数据的方法 (替换数据)
    console.log(user)
    return (
        <div>
            <p>
                姓名: { user.name }
            </p>
            <p>
                年龄: { user.age }
            </p>

            <div>
                <button onClick = {() => {
                    let obj = {...user}
                    obj.age += 1
                    setUser(obj)
                }}>++++</button>
            </div>

            {/* HomeHome --- { count }
            <div>
                <button onClick = {() => {
                    setCount(count + 1)
                }}>修改数据</button>
            </div> */}
        </div>
    )
}

export default Home
